<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:h="http://xmlns.jcp.org/jsf/html"
      xmlns:b="http://bootsfaces.net/ui"
      xmlns:ui="http://xmlns.jcp.org/jsf/facelets"
      xmlns:f="http://xmlns.jcp.org/jsf/core">
<h:head>
   <title>Java Chips</title>
   <meta name="author" content="The Author"></meta>
</h:head>
<!-- Add 50px padding top to the body for the navbar -->
<h:body style="padding-top: 50px; padding-bottom: 20px;">
   <ui:insert name="navbar">
      <ui:include src="/templates/navbar.xhtml"></ui:include>
   </ui:insert>


   <h:form>
      <h:dataTable var="product" value="#{productBean.products}"
                   cellpadding="2" cellspacing="2" border="1">
         <h:column>
            <f:facet name="header">ID</f:facet>
            <h:outputText value="#{product.productId}"></h:outputText>
         </h:column>

         <h:column>
            <f:facet name="header">Name</f:facet>
            <h:outputText value="#{product.productName}"></h:outputText>
         </h:column>
         <h:column>
            <f:facet name="header">Price</f:facet>
            <h:outputText value="#{product.productPrice}"></h:outputText>
         </h:column>
         <h:column>
            <f:facet name="header">Description</f:facet>
            <h:outputText value="#{product.productDescription}"></h:outputText>
         </h:column>
         <h:column>
            <f:facet name="header">Buy</f:facet>
            <h:commandButton value="to Cart" action="#{product.orderby(product)}"></h:commandButton>
         </h:column>
      </h:dataTable>
   </h:form>

</h:body>
</html>